<template>
  <div>
    <Header fixed title="维修员登录" />
    <div class="form-wrap">
      <Field label="用户名" placeholder="请输入用户名" v-model="formData.username" />
      <Field label="密码" placeholder="请输入密码" type="password" v-model="formData.password" />
      <Button type="primary" size="large" class="login-btn" @click="handleLogin">登录</Button>
    </div>

  </div>
</template>

<script>
  import {Header,Field,Button,Indicator,MessageBox} from 'mint-ui'

  export default {
    name: "login",
    components: {
      Header,
      Field,
      Button
    },
    data() {
      return {
        formData: {
          username: '',
          password: ''
        }
      }
    },
    methods: {
      handleLogin () {
        Indicator.open({
          text: '加载中...',
          spinnerType: 'fading-circle'
        });
        this.$axios.post('/admin/adminUser/login', this.formData)
          .then(res => {
            Indicator.close();
            if(res.code == 200){
              this.$store.commit('CHANGE_USER_INFO', res.data)
              this.$router.push('/repairLayout/all');
            } else {
              MessageBox('登录失败', res.msg);
            }
          }).catch(err => Indicator.close())
      }
    }
  }
</script>

<style scoped lang="scss">
  .form-wrap {
    width: 100%;
    padding-top: 40px;

    .login-btn {
      width: 90%;
      margin: 20px auto;
    }
  }
</style>
